<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-reset.css" rel="stylesheet">
<!--external css-->
<link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
<link href="css/style-responsive.css" rel="stylesheet" />

<link href="assets/advanced-datatable/media/css/demo_table.css"
	rel="stylesheet">
</head>
<body>
	<section class="panel">
	<div class="panel-body">
		<form method="post">
			<div class="adv-table">
				<div id="hidden-table-info_wrapper" class="dataTables_wrapper"
					role="grid">
					<div id="hidden-table-info_length" class="dataTables_length">
						<label>Show <select class="form-control" size="1"
							name="hidden-table-info_length" aria-controls="hidden-table-info"><option
									value="10" selected="selected">10</option>
								<option value="25">25</option>
								<option value="50">50</option>
								<option value="100">100</option></select> leaves
						</label>
					</div>
					<div class="dataTables_filter" id="hidden-table-info_filter">
						<label>Search: <input type="text" class="form-control"
							aria-controls="hidden-table-info"></label>
					</div>
					<table class="table">
						<thead>
							<tr>
								<th>#</th>
								<th>Employee ID</th>
								<th>Name</th>
								<th>Start Date</th>
								<th>End Date</th>
								<th>Status</th>
								<th>Reason</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td><a href="approval.jsp">1</a></td>
								<td>EM001</td>
								<td>Smith</td>
								<td>10/10/2013</td>
								<td>11/10/2013</td>
								<td>Cancelled</td>
								<td>Father's Wedding</td>
							</tr>
							<tr>
								<td>2</td>
								<td>EM001</td>
								<td>Smith</td>
								<td>29/10/2013</td>
								<td>29/10/2013</td>
								<td>Approved</td>
								<td>Mother's Wedding</td>
							</tr>
							<tr>
								<td>3</td>
								<td>EM001</td>
								<td>Smith</td>
								<td>10/12/2013</td>
								<td>10/12/2013</td>
								<td>Pending</td>
								<td>My Wedding</td>
							</tr>
						</tbody>
					</table>
					<div class="dataTables_info" id="hidden-table-info_info">Showing
						1 to 10 of 57 entries</div>
					<div class="dataTables_paginate paging_two_button"
						id="hidden-table-info_paginate">
						<a class="paginate_disabled_previous" tabindex="0" role="button"
							id="hidden-table-info_previous" aria-controls="hidden-table-info">Previous</a><a
							class="paginate_enabled_next" tabindex="0" role="button"
							id="hidden-table-info_next" aria-controls="hidden-table-info">Next</a>
					</div>
				</div>

			</div>
		</form>
	</div>
	</section>
	<!-- js placed at the end of the document so the pages load faster -->
	<script src="js/jquery.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script class="include" type="text/javascript"
		src="js/jquery.dcjqaccordion.2.7.js"></script>
	<script src="js/jquery.scrollTo.min.js"></script>
	<script src="js/jquery.nicescroll.js" type="text/javascript"></script>
	<script src="js/respond.min.js"></script>
</body>
</html>